<template>
	<div class="coupon">
		<template v-if="item.couponLink">
			<div class="btn base-flex">
				<div class="securities">{{ item.couponDiscount || '0' }}元券</div>
				<div class="url" v-copy="item.couponLink">
					复制券链接
				</div>
			</div>
			<div class="time">
				有效期：{{ item.couponGetStartTime + '000' | date_format }} ~
				{{ item.couponGetEndTime + '000' | date_format }}
			</div>
		</template>

		<template v-else>没有优惠券</template>
	</div>
</template>

<script>
export default {
	props: {
		item: [Object]
	}
};
</script>
<style lang="scss">
.coupon {
	text-align: left;
	color: $main-dark;
	font-size: $font12;
	.btn {
		.securities {
			background: #f14d27;
			border-radius: 12px;
			color: $color-white;
			padding: 0 15px;
			margin-right: 12px;
			@include flexBox();
		}
		.url {
			color: #4db7f3;
			border: 1px solid #4db7f3;
			padding: 0 15px;
			border-radius: 12px;
			@include flexBox();
			cursor: pointer;
		}
	}
	.time {
		margin-top: 10px;
	}
}
</style>
